<!--
 * @Descripttion: 
 * @Author: voanit
 * @Date: 2022-03-20 14:58:42
 * @LastEditors: voanit
 * @LastEditTime: 2022-03-20 15:54:02
-->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="./dist/redux.js"></script>
</head>

<body>
  <script>
    console.log(window.Redux);
    /* 1-获取 createStore */
    const { createStore } = window.Redux
    /* 2-创建 action */
    const action1 = {
      type: 'increment'
    }
    const action2 = {
      type: 'add',
      payload: 10
    }
    const action3 = () => {
      return {
        type: 'chen'
      }
    }
    /* 3-reducer    创建一个纯函数 */
    const reducer = (state = 2, action) => {
      console.log(action, 55);
      switch (action.type) {
        case 'add':
          return state + action.payload
        case 'increment':
          return state - 1
        case 'chen':
          return state * 2
        default:
          return state
      }
    }
    // 4-创建 store
    const store = createStore(reducer)
    /* 5-store获取状态 */
    console.log(store.getState(), 9988);
    /* 6-发起更新状态： */
    console.log(store, 777);
    store.dispatch(action2)
    console.log(store.getState(), 9988);
  </script>

</body>

</html>